<template>
	<view class="publish-page">

		
		<!-- 自定义顶部样式 -->
		<view class="custom-header">
			<!-- 左侧返回按钮 -->
			<view class="header-left">
				<view class="back-btn" @click="goBack">
					<uni-icons type="left" size="24" color="#6b7280"></uni-icons>
				</view>
			</view>
			
			<!-- 中间标题区域 -->
			<view class="header-center">
				<text class="main-title">创作发布</text>
				<text class="sub-title">分享你的精彩内容</text>
			</view>
			
			<!-- 右侧发布按钮 -->
			<view class="header-right">
				<view class="publish-btn" @click="handlePublish">
					<text class="publish-text">发布</text>
				</view>
			</view>
		</view>
		
		<!-- 页面内容 -->
		<view class="page-content">
			<!-- 选择内容类型 -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="compose" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">选择内容类型</text>
				</view>
				
				<view class="content-type-grid">
					<view 
						v-for="(type, index) in contentTypes" 
						:key="index"
						:class="['content-type-item', { active: selectedContentType === type.value }]"
						@click="selectContentType(type.value)"
					>
						<uni-icons :type="type.icon" size="32" :color="selectedContentType === type.value ? '#3b82f6' : type.color"></uni-icons>
						<text class="type-title">{{ type.title }}</text>
						<text class="type-desc">{{ type.desc }}</text>
						<view v-if="selectedContentType === type.value" class="check-icon">
							<uni-icons type="checkmarkempty" size="16" color="#3b82f6"></uni-icons>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 图文内容区域 -->
			<view v-if="selectedContentType === 'image'" class="content-section">
				<view class="section-header">
					<uni-icons type="camera" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">添加图片内容</text>
				</view>
				
				<view class="action-buttons">
					<view class="action-btn select-btn" @click="selectImage">
						<uni-icons type="upload" size="24" color="#3b82f6"></uni-icons>
						<text class="btn-text">选择图片</text>
					</view>
					<!-- <view class="action-btn shoot-btn" @click="takePhoto">
						<uni-icons type="videocam" size="24" color="#10b981"></uni-icons>
						<text class="btn-text">录像</text>
					</view> -->
				</view>
				
				<!-- 图片预览区域 -->
				<view v-if="formData.images.length > 0" class="images-preview">
					<view class="images-grid">
						<view 
							v-for="(image, index) in formData.images" 
							:key="index"
							class="image-item"
						>
							<image 
								:src="image.path" 
								class="preview-image"
								mode="aspectFill"
							></image>
							<view class="image-overlay">
								<view class="remove-image-btn" @click="removeImage(index)">
									<uni-icons type="close" size="16" color="#ffffff"></uni-icons>
								</view>
							</view>
						</view>
					</view>
				</view>
				
				<!-- 视频预览区域 -->
				<view v-if="formData.video" class="video-preview">
					<view class="video-container">
						<video 
							:src="formData.video.path" 
							class="preview-video"
							controls
							show-center-play-btn
							show-play-btn
							show-fullscreen-btn
						></video>
						<view class="video-info">
							<text class="video-duration">{{ formData.video.duration }}秒</text>
							<text class="video-size">{{ (formData.video.size / 1024 / 1024).toFixed(2) }}MB</text>
						</view>
						<view class="video-actions">
							<view class="action-btn delete-btn" @click="removeVideo">
								<uni-icons type="trash" size="16" color="#ef4444"></uni-icons>
								<text class="btn-text">删除</text>
							</view>
							<view class="action-btn replace-btn" @click="takePhoto">
								<uni-icons type="refresh" size="16" color="#3b82f6"></uni-icons>
								<text class="btn-text">重新录制</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 视频内容区域 -->
			<view v-if="selectedContentType === 'video'" class="content-section">
				<view class="section-header">
					<uni-icons type="videocam" size="20" color="#8b5cf6"></uni-icons>
					<text class="section-title">添加视频内容</text>
				</view>
				
				<view class="action-buttons">
					<view class="action-btn select-btn" @click="selectVideo">
						<uni-icons type="upload" size="24" color="#8b5cf6"></uni-icons>
						<text class="btn-text">选择视频</text>
					</view>
					<view class="action-btn shoot-btn" @click="takePhoto">
						<uni-icons type="videocam" size="24" color="#10b981"></uni-icons>
						<text class="btn-text">录制视频</text>
					</view>
				</view>
				
				<!-- 视频预览区域 -->
				<view v-if="formData.video" class="video-preview">
					<view class="video-container">
						<video 
							:src="formData.video.path" 
							class="preview-video"
							controls
							show-center-play-btn
							show-play-btn
							show-fullscreen-btn
						></video>
						<view class="video-info">
							<text class="video-duration">{{ formData.video.duration }}秒</text>
							<text class="video-size">{{ (formData.video.size / 1024 / 1024).toFixed(2) }}MB</text>
						</view>
						<view class="video-actions">
							<view class="action-btn delete-btn" @click="removeVideo">
								<uni-icons type="trash" size="16" color="#ef4444"></uni-icons>
								<text class="btn-text">删除</text>
							</view>
							<view class="action-btn replace-btn" @click="takePhoto">
								<uni-icons type="refresh" size="16" color="#8b5cf6"></uni-icons>
								<text class="btn-text">重新录制</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 音乐内容区域 -->
			<view v-if="selectedContentType === 'music'" class="content-section">
				<view class="section-header">
					<uni-icons type="sound" size="20" color="#10b981"></uni-icons>
					<text class="section-title">添加音乐内容</text>
				</view>
				
				<view class="action-buttons">
					<view class="action-btn select-btn" @click="selectMusic">
						<uni-icons type="upload" size="24" color="#10b981"></uni-icons>
						<text class="btn-text">选择音乐</text>
					</view>
					<view class="action-btn shoot-btn" @click="recordAudio">
						<uni-icons type="mic" size="24" color="#f59e0b"></uni-icons>
						<text class="btn-text">录制音频</text>
					</view>
				</view>
				
				<!-- 音乐预览区域 -->
				<view v-if="formData.music" class="music-preview">
					<view class="music-container">
						<view class="music-info">
							<uni-icons type="sound" size="48" color="#10b981"></uni-icons>
							<view class="music-details">
								<text class="music-title">{{ formData.music.name || '未命名音乐' }}</text>
								<text class="music-duration">{{ formData.music.duration }}秒</text>
							</view>
						</view>
						<view class="music-actions">
							<view class="action-btn delete-btn" @click="removeMusic">
								<uni-icons type="trash" size="16" color="#ef4444"></uni-icons>
								<text class="btn-text">删除</text>
							</view>
							<view class="action-btn replace-btn" @click="selectMusic">
								<uni-icons type="refresh" size="16" color="#10b981"></uni-icons>
								<text class="btn-text">重新选择</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 微短剧内容区域 -->
			<view v-if="selectedContentType === 'drama'" class="content-section">
				<view class="section-header">
					<uni-icons type="film" size="20" color="#f59e0b"></uni-icons>
					<text class="section-title">添加微短剧内容</text>
				</view>
				
				<!-- 微短剧标题 -->
				<view class="drama-form-item">
					<input 
						class="drama-form-input"
						placeholder="请输入剧集标题"
						v-model="formData.dramaTitle"
						maxlength="50"
					/>
				</view>
				
				<!-- 微短剧描述 -->
				<view class="drama-form-item">
					<textarea 
						class="drama-form-textarea"
						placeholder="请输入剧集描述..."
						v-model="formData.dramaDescription"
						maxlength="200"
					></textarea>
				</view>
				
				<view class="action-buttons">
					<view class="action-btn select-btn" @click="selectDramaVideo">
						<uni-icons type="upload" size="24" color="#f59e0b"></uni-icons>
						<text class="btn-text">选择视频</text>
					</view>
					<view class="action-btn shoot-btn" @click="takeDramaVideo">
						<uni-icons type="videocam" size="24" color="#10b981"></uni-icons>
						<text class="btn-text">录制</text>
					</view>
				</view>
				
				<!-- 微短剧预览区域 -->
				<view v-if="formData.dramaVideo" class="drama-preview">
					<view class="drama-container">
						<video 
							:src="formData.dramaVideo.path" 
							class="preview-video"
							controls
							show-center-play-btn
							show-play-btn
							show-fullscreen-btn
						></video>
						<view class="drama-info">
							<text class="drama-title">{{ formData.dramaVideo.name || '未命名短剧' }}</text>
							<text class="drama-duration">{{ formData.dramaVideo.duration }}秒</text>
						</view>
						<view class="drama-actions">
							<view class="action-btn delete-btn" @click="removeDramaVideo">
								<uni-icons type="trash" size="16" color="#ef4444"></uni-icons>
								<text class="btn-text">删除</text>
							</view>
							<view class="action-btn replace-btn" @click="takeDramaVideo">
								<uni-icons type="refresh" size="16" color="#f59e0b"></uni-icons>
								<text class="btn-text">重新录制</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 活动内容区域 -->
			<view v-if="selectedContentType === 'activity'" class="content-section">
				<view class="section-header">
					<uni-icons type="calendar" size="20" color="#06b6d4"></uni-icons>
					<text class="section-title">设置活动信息</text>
				</view>
				
				<view class="activity-form">
					<!-- 活动封面 -->
					<view class="form-item">
						<text class="form-label">活动封面 <text class="optional-text">(可选)</text></text>
						<view class="cover-upload-area" @click="selectActivityCover">
							<view class="upload-content">
								<uni-icons type="cloud-upload" size="48" color="#06b6d4"></uni-icons>
								<text class="upload-text">上传封面图片或介绍视频</text>
							</view>
						</view>
						
						<!-- 活动封面预览 -->
						<view v-if="formData.activityCover" class="activity-cover-preview">
							<image 
								v-if="formData.activityCover.type === 'image'"
								:src="formData.activityCover.path" 
								class="activity-cover-image"
								mode="aspectFill"
							></image>
							<video 
								v-else-if="formData.activityCover.type === 'video'"
								:src="formData.activityCover.path" 
								class="activity-cover-video"
								controls
							></video>
							<view class="remove-activity-cover" @click="removeActivityCover">
								<uni-icons type="close" size="16" color="#ffffff"></uni-icons>
							</view>
						</view>
					</view>
					
					<!-- 活动时间 -->
					<view class="form-item">
						<text class="form-label">活动时间 <text class="required-mark">*</text></text>
						<uni-datetime-picker 
							type="datetime" 
							v-model="formData.activityDateTime" 
							@change="onActivityDateTimeChange"
							placeholder="年/月/日 --:--"
						/>
					</view>
					
					<!-- 活动类型和模式 -->
					<view class="form-row">
						<!-- 活动类型 -->
						<view class="form-item half-width">
							<text class="form-label">类型</text>
							<picker 
								:value="formData.activityTypeIndex" 
								:range="activityTypes"
								@change="onActivityTypeChange"
								class="form-picker"
							>
								<view class="picker-text">
									{{ activityTypes[formData.activityTypeIndex] }}
								</view>
							</picker>
						</view>
						
						<!-- 活动模式 -->
						<view class="form-item half-width">
							<text class="form-label">模式</text>
							<picker 
								:value="formData.activityModeIndex" 
								:range="activityModes"
								@change="onActivityModeChange"
								class="form-picker"
							>
								<view class="picker-text">
									{{ activityModes[formData.activityModeIndex] }}
								</view>
							</picker>
						</view>
					</view>
					
					<!-- 人数限制 -->
					<view class="form-item">
						<text class="form-label">人数限制</text>
						<input 
							class="form-input"
							type="number"
							placeholder="最大人数"
							v-model="formData.activityMaxPeople"
						/>
					</view>
				</view>
			</view>
			
			<!-- 内容标题 -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="compose" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">内容标题</text>
					<text class="required-mark">*</text>
				</view>
				
				<input 
					class="title-input"
					placeholder="请输入内容标题"
					v-model="formData.title"
					maxlength="100"
				/>
			</view>
			
			<!-- 内容描述 -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="compose" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">内容描述</text>
					<text class="required-mark">*</text>
				</view>
				
				<textarea 
					class="description-textarea"
					placeholder="分享这个时刻的故事..."
					v-model="formData.description"
					maxlength="500"
				></textarea>
			</view>
			
			<!-- 正文内容 -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="compose" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">正文内容</text>
				</view>
				
				<textarea 
					class="description-textarea"
					placeholder="请输入正文内容..."
					v-model="formData.content"
					maxlength="2000"
				></textarea>
			</view>
			
			<!-- 标签 (可选) -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="tag" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">标签 (可选)</text>
				</view>
				
				<input 
					class="tag-input"
					placeholder="输入标签后按回车添加"
					v-model="newTag"
					@confirm="addTag"
				/>
				
				<!-- 已添加的标签 -->
				<view v-if="formData.tags.length > 0" class="tags-container">
					<view 
						v-for="(tag, index) in formData.tags" 
						:key="index"
						class="tag-item"
					>
						<text class="tag-text">{{ tag }}</text>
						<view class="remove-tag" @click="removeTag(index)">
							<uni-icons type="close" size="12" color="#6b7280"></uni-icons>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 隐私设置 -->
			<view class="content-section">
				<view class="section-header">
					<uni-icons type="globe" size="20" color="#3b82f6"></uni-icons>
					<text class="section-title">隐私设置</text>
				</view>
				
				<view class="privacy-selector" @click="showPrivacyOptions">
					<view class="privacy-content">
						<uni-icons type="globe" size="20" color="#6b7280"></uni-icons>
						<text class="privacy-text">{{ privacyOptions[selectedPrivacy].label }}</text>
					</view>
					<uni-icons type="down" size="16" color="#6b7280"></uni-icons>
				</view>
			</view>
			
			<!-- 关联商品 -->
			<view class="content-section">
				<view class="section-header">
					<text class="section-title">选择要关联的商品</text>
				</view>
				
				<!-- 商品列表 -->
				<view class="product-list">
					<view 
						v-for="(product, index) in productList" 
						:key="product.id"
						:class="['product-item', { selected: product.selected }]"
						@click="toggleProductSelection(product)"
					>
						<view class="checkbox" :class="{ checked: product.selected }">
							<uni-icons v-if="product.selected" type="checkmarkempty" size="16" color="#ffffff"></uni-icons>
						</view>
						<view class="product-icon" :style="{ backgroundColor: product.iconBg }">
							<image :src="product.icon" class="product-icon-img" mode="aspectFit"></image>
						</view>
						<view class="product-info">
							<text class="product-name">{{ product.product_name }}</text>
							<view class="product-meta">
								<text class="product-price">￥{{ product.price }}</text>
								<text class="product-status">已购买</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Header from '@/components/Header.vue'
	import { post, get } from '@/utils/request.js'
	
	export default {
		components: {
			Header
		},
		data() {
			return {
				selectedContentType: 'image', // 默认选中图文
				contentTypes: [
					{
						value: 'image',
						title: '图文',
						desc: '分享生活瞬间',
						icon: 'camera',
						color: '#3b82f6'
					},
					{
						value: 'video',
						title: '视频',
						desc: '记录精彩时刻',
						icon: 'videocam',
						color: '#8b5cf6'
					},
					// {
					// 	value: 'music',
					// 	title: '音乐',
					// 	desc: '分享美妙声音',
					// 	icon: 'sound',
					// 	color: '#10b981'
					// },
					{
						value: 'drama',
						title: '微短剧',
						desc: '创作系列内容',
						icon: 'videocam-filled',
						color: '#f59e0b'
					},
					{
						value: 'activity',
						title: '活动',
						desc: '组织聚会活动',
						icon: 'calendar',
						color: '#06b6d4'
					}
				],
				formData: {
					title: '', // 内容标题
					description: '',
					content: '', // 正文内容
					tags: [],
					video: null, // 视频字段
					images: [], // 图片字段
					music: null, // 音乐字段
					dramaVideo: null, // 微短剧视频字段
					dramaTitle: '', // 微短剧标题
					dramaDescription: '', // 微短剧描述
					activityDateTime: '', // 活动日期时间
					activityTypeIndex: 0, // 活动类型索引
					activityModeIndex: 0, // 活动模式索引
					activityMaxPeople: '', // 活动人数限制
					activityCover: null // 活动封面
				},
				newTag: '',
				selectedPrivacy: 'public',
				privacyOptions: {
					public: { value: 'public', label: '公开' },
					friends: { value: 'friends', label: '仅好友可见' },
					private: { value: 'private', label: '仅自己可见' }
				},
				// 活动类型选项
				activityTypes: ['免费活动', '付费活动', '会员专享'],
				// 活动模式选项
				activityModes: ['线下', '线上', '混合'],
				// 关联商品列表
				productList: []
			}
		},
		onLoad() {
			console.log('发布体验页面加载')
			this.loadProductList()
		},
		methods: {
			// 返回上一页
			goBack() {
				uni.navigateBack()
			},
			// 发布按钮点击
			handlePublish() {
				console.log('发布按钮被点击')
				
				// 验证必填字段
				if (!this.formData.title.trim()) {
					uni.showToast({
						title: '请输入内容标题',
						icon: 'none'
					})
					return
				}
				
				if (!this.formData.description.trim()) {
					uni.showToast({
						title: '请输入内容描述',
						icon: 'none'
					})
					return
				}
				
				// 根据内容类型检查是否有内容
				let hasContent = false
				switch (this.selectedContentType) {
					case 'image':
						hasContent = this.formData.images.length > 0 || this.formData.video
						break
					case 'video':
						hasContent = !!this.formData.video
						break
					case 'music':
						hasContent = !!this.formData.music
						break
					case 'drama':
						hasContent = !!this.formData.dramaVideo && this.formData.dramaTitle.trim()
						break
					case 'activity':
						hasContent = this.formData.activityDateTime
						break
				}
				
				if (!hasContent) {
					let errorMessage = ''
					switch (this.selectedContentType) {
						case 'image':
							errorMessage = '请添加图片或视频内容'
							break
						case 'video':
							errorMessage = '请添加视频内容'
							break
						case 'music':
							errorMessage = '请添加音乐内容'
							break
						case 'drama':
							errorMessage = '请添加微短剧视频'
							break
						case 'activity':
							errorMessage = '请完善活动信息'
							break
					}
					uni.showToast({
						title: errorMessage,
						icon: 'none'
					})
					return
				}
				
				// 显示发布确认
				uni.showModal({
					title: '确认发布',
					content: '确定要发布这条内容吗？',
					success: (res) => {
						if (res.confirm) {
							this.submitContent()
						}
					}
				})
			},
			
			// 提交内容
			async submitContent() {
				uni.showLoading({
					title: '正在发布...'
				})
				
				try {
					// 构建发布数据
					const publishData = {
						product_id: this.getSelectedProductIds(), // 使用选中商品的id
						title: this.formData.title,
						description: this.formData.description,

						content: this.formData.content,
						experience_type: this.getExperienceType(),
						experience_files: this.buildExperienceFiles(),
						label: this.formData.tags.join(','),
						visibility: this.getVisibility(),
						activity_type: this.getActivityType(),
						activity_mode: this.getActivityMode(),
						activity_time: this.formData.activityDateTime || '',
						max_participants: parseInt(this.formData.activityMaxPeople) || 0
					}
					
					console.log('发布数据:', publishData)
					// 调用发布接口
					await post('/v1/app/user/publishExperience', publishData)
					
					uni.hideLoading()
					uni.showToast({
						title: '发布成功',
						icon: 'success'
					})
					
					// 延迟跳转到world页面
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/world/world'
						})
					}, 1500)
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '发布失败',
						icon: 'none'
					})
					console.error('发布失败:', error)
				}
			},
			
			// 选择内容类型
			selectContentType(type) {
				// 如果切换内容类型，清理之前的数据
				if (this.selectedContentType !== type) {
					this.clearContentData()
				}
				this.selectedContentType = type
				console.log('选择内容类型:', type)
			},
			
			// 清理内容数据
			clearContentData() {
				// 清理所有内容相关数据
				this.formData.title = ''
				this.formData.description = ''
				this.formData.content = ''
				this.formData.images = []
				this.formData.video = null
				this.formData.music = null
				this.formData.dramaVideo = null
				this.formData.dramaTitle = ''
				this.formData.dramaDescription = ''
				this.formData.activityDateTime = ''
				this.formData.activityTypeIndex = 0
				this.formData.activityModeIndex = 0
				this.formData.activityMaxPeople = ''
				this.formData.activityCover = null
				
				// 清空关联商品选择
				this.clearProductSelection()
			},
			
			// 清空商品选择
			clearProductSelection() {
				this.productList.forEach(product => {
					product.selected = false
				})
			},
			
			// 选择图片
			selectImage() {
				uni.chooseImage({
					count: 9, // 最多选择9张图片
					sizeType: ['compressed'], // 只选择压缩图
					sourceType: ['album'],
					success: (res) => {
						console.log('选择图片成功:', res.tempFilePaths)
						this.handleSelectedImages(res.tempFilePaths)
					},
					fail: (err) => {
						console.log('选择图片失败:', err)
						uni.showToast({
							title: '选择图片失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的图片
			async handleSelectedImages(imagePaths) {
				// 检查图片数量限制
				if (this.formData.images.length + imagePaths.length > 9) {
					uni.showToast({
						title: '最多只能选择9张图片',
						icon: 'none'
					})
					return
				}
				
				// 显示上传进度
				uni.showLoading({
					title: '正在上传图片...'
				})
				
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 批量上传图片
					const uploadPromises = imagePaths.map(async (path, index) => {
						try {
							// 检查图片大小
							const imageInfo = await this.getImageInfo(path)
							if (imageInfo.size > 5 * 1024 * 1024) { // 5MB限制
								throw new Error(`第${index + 1}张图片过大`)
							}
							
							// 上传图片
							const uploadResult = await this.uploadFileToOss(path, credentials, 'image')
							
							// 返回图片信息
							return {
								path: path,
								url: uploadResult.url,
								size: imageInfo.size,
								width: imageInfo.width,
								height: imageInfo.height
							}
						} catch (error) {
							console.error(`图片${index + 1}上传失败:`, error)
							throw error
						}
					})
					
					// 等待所有图片上传完成
					const uploadedImages = await Promise.all(uploadPromises)
					
					// 添加到表单数据
					this.formData.images.push(...uploadedImages)
					
					uni.hideLoading()
					uni.showToast({
						title: `已上传${uploadedImages.length}张图片`,
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '图片上传失败',
						icon: 'none'
					})
					console.error('图片上传失败:', error)
				}
			},
			
			// 通用录制视频方法
			recordVideo(config) {
				const {
					// maxDuration = 60, // 已注释掉时长限制
					fileType = 'video',
					dataField = 'video',
					successMessage = '录像成功',
					failMessage = '录像失败，请重试',
					handleMethod = 'handleVideoRecorded'
				} = config
				
				// 检查是否支持录像功能
				uni.getSystemInfo({
					success: (res) => {
						console.log('系统信息:', res)
						
						// 调用录像功能
						uni.chooseVideo({
							sourceType: ['camera'], // 只从摄像头拍摄
							compressed: true, // 压缩视频
							// maxDuration: maxDuration, // 已注释掉时长限制
							camera: 'back', // 默认使用后置摄像头
							success: (res) => {
								console.log(successMessage, res)
								this[handleMethod](res, { fileType, dataField })
							},
							fail: (err) => {
								console.log(failMessage, err)
								uni.showToast({
									title: failMessage,
									icon: 'none'
								})
							}
						})
					},
					fail: (err) => {
						console.log('获取系统信息失败:', err)
						uni.showToast({
							title: '设备不支持录像功能',
							icon: 'none'
						})
					}
				})
			},
			
			// 拍摄录像
			takePhoto() {
				this.recordVideo({
					// maxDuration: 60, // 已注释掉时长限制
					fileType: 'video',
					dataField: 'video',
					successMessage: '录像成功',
					failMessage: '录像失败，请重试',
					handleMethod: 'handleVideoRecorded'
				})
			},
			
			// 录制微短剧视频
			takeDramaVideo() {
				this.recordVideo({
					// maxDuration: 600, // 已注释掉时长限制
					fileType: 'drama',
					dataField: 'dramaVideo',
					successMessage: '微短剧录制成功',
					failMessage: '录制失败，请重试',
					handleMethod: 'handleDramaVideoRecorded'
				})
			},
			
			// 通用处理录制的视频
			handleVideoRecorded(videoInfo, config = {}) {
				const { fileType = 'video', dataField = 'video' } = config
				const { tempFilePath, duration, size, width, height } = videoInfo
				
				// 根据文件类型设置不同的限制
				const limits = {
					video: {
						maxDuration: 60,
						maxSize: 50 * 1024 * 1024,
						durationError: '视频时长不能超过60秒',
						sizeError: '视频文件过大，请选择较短的视频'
					},
					drama: {
						maxDuration: 600,
						maxSize: 200 * 1024 * 1024,
						durationError: '微短剧时长不能超过10分钟',
						sizeError: '视频文件过大，请选择较短的视频'
					}
				}
				
				const limit = limits[fileType] || limits.video
				
				// 检查视频时长 - 已注释掉限制
				// if (duration > limit.maxDuration) {
				// 	uni.showToast({
				// 		title: limit.durationError,
				// 		icon: 'none'
				// 	})
				// 	return
				// }
				
				// 检查视频大小 - 已注释掉限制
				// if (size > limit.maxSize) {
				// 	uni.showToast({
				// 		title: limit.sizeError,
				// 		icon: 'none'
				// 	})
				// 	return
				// }
				
				// 根据文件类型显示不同的预览
				if (fileType === 'drama') {
					this.showDramaVideoPreview(tempFilePath, videoInfo)
				} else {
					this.showVideoPreview(tempFilePath, videoInfo)
				}
			},
			
			// 处理录制的微短剧视频（保持向后兼容）
			handleDramaVideoRecorded(videoInfo) {
				this.handleVideoRecorded(videoInfo, { fileType: 'drama', dataField: 'dramaVideo' })
			},
			
			// 显示视频预览
			showVideoPreview(videoPath, videoInfo) {
				uni.showModal({
					title: '视频预览',
					content: `时长: ${videoInfo.duration}秒\n大小: ${(videoInfo.size / 1024 / 1024).toFixed(2)}MB`,
					confirmText: '确认使用',
					cancelText: '重新录制',
					success: (res) => {
						if (res.confirm) {
							// 确认使用视频
							this.confirmVideoUpload(videoPath, videoInfo)
						} else {
							// 重新录制
							this.takePhoto()
						}
					}
				})
			},
			
			// 显示微短剧视频预览
			showDramaVideoPreview(videoPath, videoInfo) {
				uni.showModal({
					title: '微短剧预览',
					content: `时长: ${videoInfo.duration}秒\n大小: ${(videoInfo.size / 1024 / 1024).toFixed(2)}MB`,
					confirmText: '确认使用',
					cancelText: '重新录制',
					success: (res) => {
						if (res.confirm) {
							// 确认使用微短剧视频
							this.confirmDramaVideoUpload(videoPath, videoInfo)
						} else {
							// 重新录制
							this.takeDramaVideo()
						}
					}
				})
			},
			
			// 确认视频上传
			confirmVideoUpload(videoPath, videoInfo) {
				// 显示上传进度
				uni.showLoading({
					title: '正在上传视频...'
				})
				
				// 这里可以添加视频上传逻辑
				// 示例：上传到服务器
				this.uploadVideo(videoPath, videoInfo)
			},
			
			// 确认微短剧视频上传
			confirmDramaVideoUpload(videoPath, videoInfo) {
				// 显示上传进度
				uni.showLoading({
					title: '正在上传微短剧...'
				})
				
				// 上传微短剧视频
				this.uploadDramaVideo(videoPath, videoInfo)
			},
			
			// 上传视频到服务器
			async uploadVideo(videoPath, videoInfo) {
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传视频文件
					const uploadResult = await this.uploadFileToOss(videoPath, credentials, 'video')
					
					// 保存视频信息到表单数据
					this.formData.video = {
						path: videoPath,
						url: uploadResult.url, // 保存上传后的URL
						duration: videoInfo.duration,
						size: videoInfo.size,
						width: videoInfo.width,
						height: videoInfo.height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '视频上传成功',
						icon: 'success'
					})
					
					console.log('视频信息已保存:', this.formData.video)
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '视频上传失败',
						icon: 'none'
					})
					console.error('视频上传失败:', error)
				}
			},
			
			// 上传微短剧视频到服务器
			async uploadDramaVideo(videoPath, videoInfo) {
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传微短剧视频文件
					const uploadResult = await this.uploadFileToOss(videoPath, credentials, 'drama')
					
					// 保存微短剧视频信息到表单数据
					this.formData.dramaVideo = {
						path: videoPath,
						url: uploadResult.url, // 保存上传后的URL
						name: '微短剧视频',
						duration: videoInfo.duration,
						size: videoInfo.size,
						width: videoInfo.width,
						height: videoInfo.height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '微短剧上传成功',
						icon: 'success'
					})
					
					console.log('微短剧视频信息已保存:', this.formData.dramaVideo)
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '微短剧上传失败',
						icon: 'none'
					})
					console.error('微短剧上传失败:', error)
				}
			},
			
			// 删除视频
			removeVideo() {
				uni.showModal({
					title: '确认删除',
					content: '确定要删除这个视频吗？',
					success: (res) => {
						if (res.confirm) {
							this.formData.video = null
							uni.showToast({
								title: '视频已删除',
								icon: 'success'
							})
						}
					}
				})
			},
			
			// 删除图片
			removeImage(index) {
				uni.showModal({
					title: '确认删除',
					content: '确定要删除这张图片吗？',
					success: (res) => {
						if (res.confirm) {
							this.formData.images.splice(index, 1)
							uni.showToast({
								title: '图片已删除',
								icon: 'success'
							})
						}
					}
				})
			},
			
			// 获取OSS签名
			async getOssSign() {
				try {
					const credentials = await post('/v1/getOssSign', {
						bucket: 'juezhi/publish'
					})
					
					return credentials
				} catch (error) {
					console.error('获取OSS签名失败:', error)
					throw new Error('获取上传凭证失败')
				}
			},
			
			// 获取图片信息
			getImageInfo(path) {
				return new Promise((resolve, reject) => {
					uni.getImageInfo({
						src: path,
						success: resolve,
						fail: reject
					})
				})
			},
			
			// 上传文件到OSS
			async uploadFileToOss(filePath, credentials, fileType) {
				try {
					// 生成文件名
					const timestamp = Date.now()
					const randomStr = Math.random().toString(36).substring(2, 15)
					const fileExtension = fileType === 'video' ? '.mp4' : '.jpg'
					const fileName = `${fileType}_${timestamp}_${randomStr}${fileExtension}`
					
					// 检查运行环境
					const platform = uni.getSystemInfoSync().platform
					
					if (platform === 'h5') {
						// H5环境使用fetch + FormData
						return await this.uploadFileH5(filePath, credentials, fileName)
					} else {
						// 小程序环境使用uni.uploadFile
						return await this.uploadFileMiniProgram(filePath, credentials, fileName)
					}
				} catch (error) {
					console.error('文件上传失败:', error)
					throw new Error('文件上传失败')
				}
			},
			
			// H5环境上传
			async uploadFileH5(filePath, credentials, fileName) {
				// 构建FormData
				const formData = new FormData()
				formData.append('OSSAccessKeyId', credentials.ossAccessKeyId)
				formData.append('policy', credentials.policy)
				formData.append('Signature', credentials.signature)
				formData.append('key', `juezhi/${fileName}`)
				
				// 读取文件并添加到FormData
				const fileContent = await this.readFileAsBlob(filePath)
				formData.append('file', fileContent, fileName)
				
				// 使用fetch上传
				const response = await fetch(credentials.host, {
					method: 'POST',
					body: formData
				})
				
				// 验证上传结果（阿里云OSS成功返回204）
				if (response.status !== 200 && response.status !== 204) {
					throw new Error(`上传失败，状态码: ${response.status}`)
				}
				
				// 构建文件URL
				const fileUrl = `${credentials.host}/${credentials.dir}/${fileName}`
				console.log('fileUrl', fileUrl)
				
				return {
					url: fileUrl,
					fileName: fileName,
					key: `juezhi/${fileName}`
				}
			},
			
			// 小程序环境上传
			async uploadFileMiniProgram(filePath, credentials, fileName) {
				return new Promise((resolve, reject) => {
					const uploadTask = uni.uploadFile({
						url: credentials.host,
						// url: "https://awarelife.oss-cn-shenzhen.aliyuncs.com/",
						filePath: filePath,
						name: 'file',
						formData: {
							OSSAccessKeyId: credentials.ossAccessKeyId,
							policy: credentials.policy,
							Signature: credentials.signature,
							key: `${credentials.dir}/${fileName}`
						},
						success: (res) => {
							// 验证上传结果
							if (res.statusCode === 200 || res.statusCode === 204) {
								const fileUrl = `${credentials.host}/${credentials.dir}/${fileName}`
								console.log('fileUrl', fileUrl)
								resolve({
									url: fileUrl,
									fileName: fileName,
									key: `juezhi/${fileName}`
								})
							} else {
								reject(new Error(`上传失败，状态码: ${res.statusCode}`))
							}
						},
						fail: (err) => {
							console.error('上传失败:', err)
							reject(err)
						}
					})
					
					// 监听上传进度
					uploadTask.onProgressUpdate((res) => {
						const progress = res.progress
						uni.showLoading({
							title: `上传中 ${progress}%`
						})
					})
				})
			},
			
			// 读取文件为Blob
			readFileAsBlob(filePath) {
				return new Promise((resolve, reject) => {
					// 在小程序中使用uni.getFileSystemManager读取文件
					if (uni.getFileSystemManager) {
						uni.getFileSystemManager().readFile({
							filePath: filePath,
							success: (res) => {
								// 将ArrayBuffer转换为Blob
								const blob = new Blob([res.data], { type: 'application/octet-stream' })
								resolve(blob)
							},
							fail: (err) => {
								console.error('读取文件失败:', err)
								reject(err)
							}
						})
					} else {
						// H5环境下的处理
						reject(new Error('H5环境不支持文件读取'))
					}
				})
			},
			
			// 添加标签
			addTag() {
				if (this.newTag.trim() && !this.formData.tags.includes(this.newTag.trim())) {
					this.formData.tags.push(this.newTag.trim())
					this.newTag = ''
				}
			},
			
			// 移除标签
			removeTag(index) {
				this.formData.tags.splice(index, 1)
			},
			
			// 显示隐私选项
			showPrivacyOptions() {
				uni.showActionSheet({
					itemList: ['公开', '仅好友可见', '仅自己可见'],
					success: (res) => {
						const options = ['public', 'friends', 'private']
						this.selectedPrivacy = options[res.tapIndex]
					}
				})
			},
			
			// 选择视频
			selectVideo() {
				uni.chooseVideo({
					count: 1,
					sourceType: ['album'],
					compressed: true,
					// maxDuration: 300, // 已注释掉时长限制 - 5分钟
					success: (res) => {
						console.log('选择视频成功:', res)
						this.handleSelectedVideo(res)
					},
					fail: (err) => {
						console.log('选择视频失败:', err)
						uni.showToast({
							title: '选择视频失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的视频
			async handleSelectedVideo(videoInfo) {
				const { tempFilePath, duration, size, width, height } = videoInfo
				
				// 检查视频时长
				if (duration > 300) {
					uni.showToast({
						title: '视频时长不能超过5分钟',
						icon: 'none'
					})
					return
				}
				
				// 检查视频大小（限制为100MB）
				if (size > 100 * 1024 * 1024) {
					uni.showToast({
						title: '视频文件过大，请选择较小的视频',
						icon: 'none'
					})
					return
				}
				
				// 显示上传进度
				uni.showLoading({
					title: '正在上传视频...'
				})
				
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传视频
					const uploadResult = await this.uploadFileToOss(tempFilePath, credentials, 'video')
					
					// 保存视频信息
					this.formData.video = {
						path: tempFilePath,
						url: uploadResult.url,
						duration: duration,
						size: size,
						width: width,
						height: height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '视频上传成功',
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '视频上传失败',
						icon: 'none'
					})
					console.error('视频上传失败:', error)
				}
			},
			
			// 选择音乐
			selectMusic() {
				uni.chooseFile({
					count: 1,
					type: 'file',
					extension: ['mp3', 'wav', 'm4a'],
					success: (res) => {
						console.log('选择音乐成功:', res)
						this.handleSelectedMusic(res.tempFiles[0])
					},
					fail: (err) => {
						console.log('选择音乐失败:', err)
						uni.showToast({
							title: '选择音乐失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的音乐
			async handleSelectedMusic(musicFile) {
				// 检查文件大小（限制为20MB）
				if (musicFile.size > 20 * 1024 * 1024) {
					uni.showToast({
						title: '音乐文件过大',
						icon: 'none'
					})
					return
				}
				
				// 显示上传进度
				uni.showLoading({
					title: '正在上传音乐...'
				})
				
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传音乐文件
					const uploadResult = await this.uploadFileToOss(musicFile.path, credentials, 'music')
					
					// 保存音乐信息
					this.formData.music = {
						path: musicFile.path,
						url: uploadResult.url,
						name: musicFile.name,
						size: musicFile.size,
						duration: 0 // 需要额外处理获取音频时长
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '音乐上传成功',
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '音乐上传失败',
						icon: 'none'
					})
					console.error('音乐上传失败:', error)
				}
			},
			
			// 录制音频
			recordAudio() {
				uni.showToast({
					title: '录音功能开发中',
					icon: 'none'
				})
			},
			
			// 删除音乐
			removeMusic() {
				uni.showModal({
					title: '确认删除',
					content: '确定要删除这个音乐吗？',
					success: (res) => {
						if (res.confirm) {
							this.formData.music = null
							uni.showToast({
								title: '音乐已删除',
								icon: 'success'
							})
						}
					}
				})
			},
			
			// 选择微短剧视频
			selectDramaVideo() {
				uni.chooseVideo({
					count: 1,
					sourceType: ['album'],
					compressed: true,
					// maxDuration: 600, // 已注释掉时长限制 - 10分钟
					success: (res) => {
						console.log('选择微短剧视频成功:', res)
						this.handleSelectedDramaVideo(res)
					},
					fail: (err) => {
						console.log('选择微短剧视频失败:', err)
						uni.showToast({
							title: '选择视频失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的微短剧视频
			async handleSelectedDramaVideo(videoInfo) {
				const { tempFilePath, duration, size, width, height } = videoInfo
				
				// 检查视频时长
				if (duration > 600) {
					uni.showToast({
						title: '微短剧时长不能超过10分钟',
						icon: 'none'
					})
					return
				}
				
				// 检查视频大小（限制为200MB）
				if (size > 200 * 1024 * 1024) {
					uni.showToast({
						title: '视频文件过大，请选择较小的视频',
						icon: 'none'
					})
					return
				}
				
				// 显示上传进度
				uni.showLoading({
					title: '正在上传微短剧...'
				})
				
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传视频
					const uploadResult = await this.uploadFileToOss(tempFilePath, credentials, 'drama')
					
					// 保存视频信息
					this.formData.dramaVideo = {
						path: tempFilePath,
						url: uploadResult.url,
						name: '微短剧视频',
						duration: duration,
						size: size,
						width: width,
						height: height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '微短剧上传成功',
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '微短剧上传失败',
						icon: 'none'
					})
					console.error('微短剧上传失败:', error)
				}
			},
			
			// 删除微短剧视频
			removeDramaVideo() {
				uni.showModal({
					title: '确认删除',
					content: '确定要删除这个微短剧吗？',
					success: (res) => {
						if (res.confirm) {
							this.formData.dramaVideo = null
							uni.showToast({
								title: '微短剧已删除',
								icon: 'success'
							})
						}
					}
				})
			},
			
			// 活动日期时间选择
			onActivityDateTimeChange(e) {
				this.formData.activityDateTime = e
				console.log('活动时间:', e)
			},
			
			// 活动类型选择
			onActivityTypeChange(e) {
				this.formData.activityTypeIndex = e.detail.value
			},
			
			// 活动模式选择
			onActivityModeChange(e) {
				this.formData.activityModeIndex = e.detail.value
			},
			
			// 选择活动封面
			selectActivityCover() {
				uni.showActionSheet({
					itemList: ['选择图片', '选择视频'],
					success: (res) => {
						if (res.tapIndex === 0) {
							this.selectActivityCoverImage()
						} else if (res.tapIndex === 1) {
							this.selectActivityCoverVideo()
						}
					}
				})
			},
			
			// 选择活动封面图片
			selectActivityCoverImage() {
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: (res) => {
						console.log('选择活动图片成功:', res.tempFilePaths)
						this.handleSelectedActivityCoverImage(res.tempFilePaths[0])
					},
					fail: (err) => {
						console.log('选择活动图片失败:', err)
						uni.showToast({
							title: '选择图片失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的活动封面图片
			async handleSelectedActivityCoverImage(imagePath) {
				// 显示上传进度
				uni.showLoading({
					title: '正在上传图片...'
				})
				
				try {
					// 检查图片大小
					const imageInfo = await this.getImageInfo(imagePath)
					if (imageInfo.size > 5 * 1024 * 1024) { // 5MB限制
						throw new Error('图片过大')
					}
					
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传图片
					const uploadResult = await this.uploadFileToOss(imagePath, credentials, 'activity')
					
					// 保存图片信息
					this.formData.activityCover = {
						path: imagePath,
						url: uploadResult.url,
						type: 'image',
						size: imageInfo.size,
						width: imageInfo.width,
						height: imageInfo.height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '活动封面上传成功',
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '活动封面上传失败',
						icon: 'none'
					})
					console.error('活动封面上传失败:', error)
				}
			},
			
			// 选择活动封面视频
			selectActivityCoverVideo() {
				uni.chooseVideo({
					count: 1,
					sourceType: ['album'],
					compressed: true,
					// maxDuration: 60, // 已注释掉时长限制 - 1分钟
					success: (res) => {
						console.log('选择活动封面视频成功:', res)
						this.handleSelectedActivityCoverVideo(res)
					},
					fail: (err) => {
						console.log('选择活动封面视频失败:', err)
						uni.showToast({
							title: '选择视频失败',
							icon: 'none'
						})
					}
				})
			},
			
			// 处理选择的活动封面视频
			async handleSelectedActivityCoverVideo(videoInfo) {
				const { tempFilePath, duration, size, width, height } = videoInfo
				
				// 检查视频时长
				if (duration > 60) {
					uni.showToast({
						title: '封面视频不能超过1分钟',
						icon: 'none'
					})
					return
				}
				
				// 检查视频大小（限制为20MB）
				if (size > 20 * 1024 * 1024) {
					uni.showToast({
						title: '视频文件过大',
						icon: 'none'
					})
					return
				}
				
				// 显示上传进度
				uni.showLoading({
					title: '正在上传视频...'
				})
				
				try {
					// 获取OSS签名
					const credentials = await this.getOssSign()
					
					// 上传视频
					const uploadResult = await this.uploadFileToOss(tempFilePath, credentials, 'activity-cover')
					
					// 保存视频信息
					this.formData.activityCover = {
						path: tempFilePath,
						url: uploadResult.url,
						type: 'video',
						duration: duration,
						size: size,
						width: width,
						height: height
					}
					
					uni.hideLoading()
					uni.showToast({
						title: '活动封面上传成功',
						icon: 'success'
					})
				} catch (error) {
					uni.hideLoading()
					uni.showToast({
						title: '活动封面上传失败',
						icon: 'none'
					})
					console.error('活动封面上传失败:', error)
				}
			},
			
			// 获取体验类型
			getExperienceType() {
				const typeMap = {
					'image': 1, // 图文
					'video': 2, // 视频
					'music': 3, // 音乐
					'drama': 4, // 微短剧
					'activity': 5 // 活动
				}
				return typeMap[this.selectedContentType] || 1
			},
			
			// 构建体验文件数组
			buildExperienceFiles() {
				const files = []
				
				switch (this.selectedContentType) {
					case 'image':
						// 添加图片文件
						this.formData.images.forEach((img, index) => {
							files.push({
								episode: index + 1,
								title: `图片${index + 1}`,
								file_type: 1, // 图片
								file_path: img.url,
								product_ids: "0"
							})
						})
						// 添加视频文件（如果有）
						if (this.formData.video) {
							files.push({
								episode: files.length + 1,
								title: "视频内容",
								file_type: 2, // 视频
								file_path: this.formData.video.url,
								product_ids: "0"
							})
						}
						break
						
					case 'video':
						if (this.formData.video) {
							files.push({
								episode: 1,
								title: "视频内容",
								file_type: 2, // 视频
								file_path: this.formData.video.url,
								product_ids: "0"
							})
						}
						break
						
					case 'music':
						if (this.formData.music) {
							files.push({
								episode: 1,
								title: this.formData.music.name || "音乐内容",
								file_type: 2, // 视频（音频文件用视频类型）
								file_path: this.formData.music.url,
								product_ids: "0"
							})
						}
						break
						
					case 'drama':
						if (this.formData.dramaVideo) {
							files.push({
								episode: 1,
								title: this.formData.dramaTitle || "微短剧",
								file_type: 2, // 视频
								file_path: this.formData.dramaVideo.url,
								product_ids: "0"
							})
						}
						break
						
					case 'activity':
						if (this.formData.activityCover) {
							files.push({
								episode: 1,
								title: "活动封面",
								file_type: this.formData.activityCover.type === 'image' ? 1 : 2,
								file_path: this.formData.activityCover.url,
								product_ids: "3"
							})
						}
						break
				}
				
				return files
			},
			
			// 获取可见性
			getVisibility() {
				const visibilityMap = {
					'public': 1, // 公开
					'friends': 2, // 仅好友可见
					'private': 3 // 私密
				}
				return visibilityMap[this.selectedPrivacy] || 1
			},
			
			// 获取活动类型
			getActivityType() {
				if (this.selectedContentType !== 'activity') return 0
				const typeMap = {
					'线下': 2,
					'线上': 1,
					'混合': 3
				}
				return typeMap[this.activityModes[this.formData.activityModeIndex]] || 0
			},
			
			// 获取活动模式
			getActivityMode() {
				if (this.selectedContentType !== 'activity') return 0
				const modeMap = {
					'免费活动': 1,
					'付费活动': 2,
					'会员专享': 2 // 会员专享也算付费
				}
				return modeMap[this.activityTypes[this.formData.activityTypeIndex]] || 0
			},
			
			// 删除活动封面
			removeActivityCover() {
				uni.showModal({
					title: '确认删除',
					content: '确定要删除这个活动封面吗？',
					success: (res) => {
						if (res.confirm) {
							this.formData.activityCover = null
							uni.showToast({
								title: '活动封面已删除',
								icon: 'success'
							})
						}
					}
				})
			},
			
			// 加载商品列表
			async loadProductList() {
				try {
					// 调用接口获取商品列表
					const response = await get('/v1/app/user/purchaseList')
					console.log('商品列表接口返回:', response)
					
					// 使用接口返回的真实数据
					this.productList = response.map(item => ({
						...item,
						selected: false, // 添加选中状态
						icon: item.ProductSkus && item.ProductSkus.length > 0 
							? (item.ProductSkus[0].sku_image_path || '/static/logo.png')
							: '/static/logo.png', // 使用第一个SKU的图片或默认图片
						iconBg: this.getRandomIconBg(), // 随机背景色
						price: item.ProductSkus && item.ProductSkus.length > 0 
							? item.ProductSkus[0].sku_price 
							: 0, // 使用第一个SKU的价格
						status: '已购买' // 写死状态
					}))
				} catch (error) {
					console.error('获取商品列表失败:', error)
					uni.showToast({
						title: '获取商品列表失败',
						icon: 'none'
					})
				}
			},
			
			// 获取随机图标背景色
			getRandomIconBg() {
				const colors = ['#fbbf24', '#9ca3af', '#10b981', '#3b82f6', '#8b5cf6', '#ef4444']
				return colors[Math.floor(Math.random() * colors.length)]
			},
			
			// 切换商品选择状态
			toggleProductSelection(product) {
				product.selected = !product.selected
				console.log('选中商品:', this.getSelectedProducts())
			},
			
			// 获取选中的商品
			getSelectedProducts() {
				return this.productList.filter(product => product.selected)
			},
			
			// 获取选中商品的id数组
			getSelectedProductIds() {
				return this.productList
					.filter(product => product.selected)
					.map(product => product.id)
			},
			
			// 添加商品（已注释）
			// addProduct() {
			// 	uni.showToast({
			// 		title: '添加商品功能开发中',
			// 		icon: 'none'
			// 	})
			// }
		}
	}
</script>

<style lang="scss" scoped>
.publish-page {
	height: 100vh;
	background: #E7EBF2;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

/* 自定义顶部样式 */
.custom-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 20rpx 30rpx;
	background: #ffffff;
	border-bottom: 1rpx solid #f0f0f0;
	position: relative;
	z-index: 100;
}

.header-left {
	.back-btn {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		background: #f3f4f6;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all 0.2s ease;
		
		&:active {
			transform: scale(0.95);
			background: #e5e7eb;
		}
	}
}

.header-center {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8rpx;
	
	.main-title {
		font-size: 32rpx;
		font-weight: 600;
		color: #1f2937;
		line-height: 1.2;
	}
	
	.sub-title {
		font-size: 24rpx;
		color: #6b7280;
		font-weight: 400;
	}
}

.header-right {
	.publish-btn {
		padding: 12rpx 24rpx;
		background: linear-gradient(135deg, #8b5cf6, #3b82f6);
		border-radius: 24rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		transition: all 0.2s ease;
		
		&:active {
			transform: scale(0.95);
			background: linear-gradient(135deg, #7c3aed, #2563eb);
		}
		
		.publish-text {
			font-size: 26rpx;
			font-weight: 500;
			color: #ffffff;
		}
	}
}

.page-content {
	flex: 1;
	padding: 30rpx;
	display: flex;
	flex-direction: column;
	gap: 40rpx;
	overflow-y: auto;
}

/* 内容区域样式 */
.content-section {
	background: #ffffff;
	border-radius: 24rpx;
	padding: 32rpx;
	box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
}

.section-header {
	display: flex;
	align-items: center;
	gap: 12rpx;
	margin-bottom: 24rpx;
	
	.section-title {
		font-size: 28rpx;
		font-weight: 600;
		color: #1f2937;
	}
}

/* 内容类型网格 */
.content-type-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20rpx;
}

.content-type-item {
	position: relative;
	background: #ffffff;
	border: 2rpx solid #e5e7eb;
	border-radius: 20rpx;
	padding: 24rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12rpx;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&.active {
		border-color: #3b82f6;
		background: #eff6ff;
	}
	
	&:active {
		transform: scale(0.98);
	}
	
	.type-title {
		font-size: 26rpx;
		font-weight: 600;
		color: #1f2937;
	}
	
	.type-desc {
		font-size: 22rpx;
		color: #6b7280;
		text-align: center;
		line-height: 1.4;
	}
	
	.check-icon {
		position: absolute;
		bottom: 12rpx;
		left: 50%;
		transform: translateX(-50%);
	}
}

/* 活动按钮单独一行 */
.content-type-item:nth-child(5) {
	grid-column: 1 / -1;
	width: 50%;
	margin: 0 auto;
}

/* 操作按钮 */
.action-buttons {
	display: flex;
	gap: 20rpx;
}

.action-btn {
	flex: 1;
	height: 80rpx;
	border-radius: 16rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12rpx;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&:active {
		transform: scale(0.98);
	}
	
	&.select-btn {
		background: #eff6ff;
		border: 2rpx solid #3b82f6;
		
		.btn-text {
			color: #3b82f6;
		}
	}
	
	&.shoot-btn {
		background: #ecfdf5;
		border: 2rpx solid #10b981;
		
		.btn-text {
			color: #10b981;
		}
	}
	
	.btn-text {
		font-size: 26rpx;
		font-weight: 500;
	}
}

/* 必填标记 */
.required-mark {
	color: #ef4444;
	font-size: 24rpx;
	margin-left: 4rpx;
}

/* 内容标题输入框 */
.title-input {
	width: 100%;
	height: 60rpx;
	padding: 0 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 28rpx;
	font-weight: 500;
	color: #1f2937;
	box-sizing: border-box;
	
	&:focus {
		border-color: #3b82f6;
		background: #ffffff;
	}
}

/* 内容描述文本框 */
.description-textarea {
	width: 100%;
	min-height: 120rpx;
	padding: 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 26rpx;
	color: #1f2937;
	resize: none;
	box-sizing: border-box;
	
	&:focus {
		border-color: #3b82f6;
		background: #ffffff;
	}
}

/* 标签输入框 */
.tag-input {
	width: 100%;
	height: 60rpx;
	padding: 0 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 26rpx;
	color: #1f2937;
	box-sizing: border-box;
	
	&:focus {
		border-color: #3b82f6;
		background: #ffffff;
	}
}

/* 标签容器 */
.tags-container {
	display: flex;
	flex-wrap: wrap;
	gap: 12rpx;
	margin-top: 16rpx;
}

.tag-item {
	display: flex;
	align-items: center;
	gap: 8rpx;
	padding: 8rpx 16rpx;
	background: #eff6ff;
	border: 1rpx solid #3b82f6;
	border-radius: 20rpx;
	
	.tag-text {
		font-size: 24rpx;
		color: #3b82f6;
	}
	
	.remove-tag {
		width: 24rpx;
		height: 24rpx;
		border-radius: 50%;
		background: #3b82f6;
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		
		&:active {
			background: #2563eb;
		}
	}
}

/* 图片预览区域 */
.images-preview {
	margin-top: 20rpx;
}

.images-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12rpx;
}

.image-item {
	position: relative;
	aspect-ratio: 1;
	border-radius: 12rpx;
	overflow: hidden;
}

.preview-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.image-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.3);
	opacity: 0;
	transition: opacity 0.2s ease;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	padding: 8rpx;
}

.image-item:hover .image-overlay {
	opacity: 1;
}

.remove-image-btn {
	width: 32rpx;
	height: 32rpx;
	border-radius: 50%;
	background: rgba(239, 68, 68, 0.8);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.2s ease;
	
	&:active {
		background: rgba(239, 68, 68, 1);
	}
}

/* 视频预览区域 */
.video-preview {
	margin-top: 20rpx;
}

.video-container {
	background: #f9fafb;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	overflow: hidden;
}

.preview-video {
	width: 100%;
	height: 300rpx;
	background: #000;
}

.video-info {
	display: flex;
	justify-content: space-between;
	padding: 16rpx 20rpx;
	background: #f3f4f6;
	
	.video-duration,
	.video-size {
		font-size: 24rpx;
		color: #6b7280;
	}
}

.video-actions {
	display: flex;
	gap: 12rpx;
	padding: 16rpx 20rpx;
	background: #ffffff;
}

.video-actions .action-btn {
	flex: 1;
	height: 60rpx;
	border-radius: 12rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8rpx;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&.delete-btn {
		background: #fef2f2;
		border: 1rpx solid #ef4444;
		
		.btn-text {
			color: #ef4444;
			font-size: 24rpx;
		}
		
		&:active {
			background: #fee2e2;
		}
	}
	
	&.replace-btn {
		background: #eff6ff;
		border: 1rpx solid #3b82f6;
		
		.btn-text {
			color: #3b82f6;
			font-size: 24rpx;
		}
		
		&:active {
			background: #dbeafe;
		}
	}
}

/* 隐私选择器 */
.privacy-selector {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&:active {
		background: #f3f4f6;
	}
	
	.privacy-content {
		display: flex;
		align-items: center;
		gap: 12rpx;
		
		.privacy-text {
			font-size: 26rpx;
			color: #1f2937;
		}
	}
}

/* 音乐预览区域 */
.music-preview {
	margin-top: 20rpx;
}

.music-container {
	background: #f9fafb;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	padding: 24rpx;
}

.music-info {
	display: flex;
	align-items: center;
	gap: 20rpx;
	margin-bottom: 20rpx;
}

.music-details {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8rpx;
}

.music-title {
	font-size: 28rpx;
	font-weight: 600;
	color: #1f2937;
}

.music-duration {
	font-size: 24rpx;
	color: #6b7280;
}

.music-actions {
	display: flex;
	gap: 12rpx;
}

.music-actions .action-btn {
	flex: 1;
	height: 60rpx;
	border-radius: 12rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8rpx;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&.delete-btn {
		background: #fef2f2;
		border: 1rpx solid #ef4444;
		
		.btn-text {
			color: #ef4444;
			font-size: 24rpx;
		}
		
		&:active {
			background: #fee2e2;
		}
	}
	
	&.replace-btn {
		background: #ecfdf5;
		border: 1rpx solid #10b981;
		
		.btn-text {
			color: #10b981;
			font-size: 24rpx;
		}
		
		&:active {
			background: #d1fae5;
		}
	}
}

/* 微短剧表单样式 */
.drama-form-item {
	display: flex;
	flex-direction: column;
	gap: 12rpx;
	margin-bottom: 24rpx;
}

.drama-form-label {
	font-size: 26rpx;
	font-weight: 600;
	color: #1f2937;
}

.drama-form-input {
	width: 100%;
	height: 60rpx;
	padding: 0 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 26rpx;
	color: #1f2937;
	box-sizing: border-box;
	
	&:focus {
		border-color: #f59e0b;
		background: #ffffff;
	}
}

.drama-form-textarea {
	width: 100%;
	min-height: 120rpx;
	padding: 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 26rpx;
	color: #1f2937;
	resize: none;
	box-sizing: border-box;
	
	&:focus {
		border-color: #f59e0b;
		background: #ffffff;
	}
}

/* 微短剧预览区域 */
.drama-preview {
	margin-top: 20rpx;
}

.drama-container {
	background: #f9fafb;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	overflow: hidden;
}

.drama-info {
	display: flex;
	justify-content: space-between;
	padding: 16rpx 20rpx;
	background: #f3f4f6;
	
	.drama-title {
		font-size: 26rpx;
		font-weight: 600;
		color: #1f2937;
	}
	
	.drama-duration {
		font-size: 24rpx;
		color: #6b7280;
	}
}

.drama-actions {
	display: flex;
	gap: 12rpx;
	padding: 16rpx 20rpx;
	background: #ffffff;
}

.drama-actions .action-btn {
	flex: 1;
	height: 60rpx;
	border-radius: 12rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8rpx;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&.delete-btn {
		background: #fef2f2;
		border: 1rpx solid #ef4444;
		
		.btn-text {
			color: #ef4444;
			font-size: 24rpx;
		}
		
		&:active {
			background: #fee2e2;
		}
	}
	
	&.replace-btn {
		background: #fffbeb;
		border: 1rpx solid #f59e0b;
		
		.btn-text {
			color: #f59e0b;
			font-size: 24rpx;
		}
		
		&:active {
			background: #fef3c7;
		}
	}
}

/* 活动表单样式 */
.activity-form {
	display: flex;
	flex-direction: column;
	gap: 24rpx;
}

.form-row {
	display: flex;
	gap: 20rpx;
}

.half-width {
	flex: 1;
}

.optional-text {
	color: #6b7280;
	font-size: 24rpx;
	font-weight: 400;
}

/* 活动封面上传区域 */
.cover-upload-area {
	width: 100%;
	height: 200rpx;
	border: 2rpx dashed #06b6d4;
	border-radius: 16rpx;
	background: #f0f9ff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.2s ease;
	
	&:active {
		background: #e0f2fe;
		border-color: #0891b2;
	}
}

.upload-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16rpx;
}

.upload-text {
	font-size: 26rpx;
	color: #06b6d4;
	text-align: center;
}

/* 活动封面预览 */
.activity-cover-preview {
	position: relative;
	width: 100%;
	height: 200rpx;
	border-radius: 16rpx;
	overflow: hidden;
	margin-top: 12rpx;
}

.activity-cover-image,
.activity-cover-video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.remove-activity-cover {
	position: absolute;
	top: 8rpx;
	right: 8rpx;
	width: 32rpx;
	height: 32rpx;
	border-radius: 50%;
	background: rgba(239, 68, 68, 0.8);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.2s ease;
	
	&:active {
		background: rgba(239, 68, 68, 1);
	}
}

.form-item {
	display: flex;
	flex-direction: column;
	gap: 12rpx;
}

.form-label {
	font-size: 26rpx;
	font-weight: 600;
	color: #1f2937;
}

.form-input {
	width: 100%;
	height: 60rpx;
	padding: 0 20rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	font-size: 26rpx;
	color: #1f2937;
	box-sizing: border-box;
	
	&:focus {
		border-color: #06b6d4;
		background: #ffffff;
	}
}

.form-picker {
	width: 100%;
	height: 60rpx;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	background: #f9fafb;
	display: flex;
	align-items: center;
	padding: 0 20rpx;
	box-sizing: border-box;
}

.picker-text {
	font-size: 26rpx;
	color: #1f2937;
}



/* 关联商品样式 */
.section-header {
	position: relative;
	display: flex;
	align-items: center;
	gap: 12rpx;
	margin-bottom: 24rpx;
	
	.section-title {
		font-size: 28rpx;
		font-weight: 600;
		color: #1f2937;
	}
	
	.status-tag {
		padding: 8rpx 12rpx;
		background: #fef3c7;
		border-radius: 12rpx;
		display: flex;
		align-items: center;
		
		.status-text {
			font-size: 20rpx;
			color: #d97706;
			font-weight: 500;
		}
	}
	
	.add-product-btn {
		display: flex;
		align-items: center;
		gap: 8rpx;
		padding: 8rpx 16rpx;
		border-radius: 16rpx;
		background: #f3f4f6;
		cursor: pointer;
		transition: all 0.2s ease;
		
		&:active {
			background: #e5e7eb;
		}
		
		.add-text {
			font-size: 24rpx;
			color: #1f2937;
			font-weight: 500;
		}
	}
}



.product-list {
	display: flex;
	flex-direction: column;
	gap: 16rpx;
}

.product-item {
	display: flex;
	align-items: center;
	gap: 20rpx;
	padding: 20rpx;
	background: #ffffff;
	border: 1rpx solid #e5e7eb;
	border-radius: 16rpx;
	transition: all 0.2s ease;
	cursor: pointer;
	
	&:active {
		background: #f9fafb;
	}
	
	&.selected {
		border-color: #3b82f6;
		background: #eff6ff;
	}
}

.checkbox {
	width: 32rpx;
	height: 32rpx;
	border: 2rpx solid #d1d5db;
	border-radius: 6rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	flex-shrink: 0;
	
	&.checked {
		background: #3b82f6;
		border-color: #3b82f6;
	}
}

.product-icon {
	width: 80rpx;
	height: 80rpx;
	border-radius: 12rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.product-icon-img {
	width: 48rpx;
	height: 48rpx;
}

.product-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8rpx;
}

.product-name {
	font-size: 28rpx;
	font-weight: 600;
	color: #1f2937;
	line-height: 1.3;
}

.product-meta {
	display: flex;
	align-items: center;
	gap: 16rpx;
}

.product-price {
	font-size: 26rpx;
	color: #6b7280;
	font-weight: 500;
}

.product-status {
	font-size: 24rpx;
	color: #6b7280;
}

/* 响应式适配 */
@media screen and (max-width: 750rpx) {
	.custom-header {
		padding: 16rpx 20rpx;
	}
	
	.header-center {
		.main-title {
			font-size: 28rpx;
		}
		
		.sub-title {
			font-size: 22rpx;
		}
	}
	
	.header-right .publish-btn {
		padding: 10rpx 20rpx;
		
		.publish-text {
			font-size: 24rpx;
		}
	}
}
</style>
